define(['Utils/GradientColor', 'dojo/_base/declare'], function(GradientColor, declare) {
  'use strict';
  // 实现色标分段图例
  return declare(null, {
    colorPonitArr: [], // 色点数据 依据这个数据进行色段划分
    gradientColorObj: null, // 渐变颜色生成对象
    minValue: 0,
    maxValue: 0,
    colorSegmCount: 0, // 色段数
    gradientColorArr: [], // 生成的渐变色数组
    gradientColorValueArr: [], // 生成的渐变色数组对应的数据,用于绘制

    /**
     *
     * @param {Number} minValue 最小值
     * @param {Number} maxValue 最大值
     * @param {Number} colorSegmCount 色段数 3的倍数
     */
    constructor(minValue, maxValue, colorSegmCount) {
      this.colorPonitArr = [];
      this.colorPonitArr.push([0, 0, 255]); // 蓝
      this.colorPonitArr.push([0, 255, 0]); // 绿
      this.colorPonitArr.push([255, 255, 0]); // 黄
      this.colorPonitArr.push([255, 0, 0]); // 红
      this.gradientColorObj = new GradientColor();

      this.minValue = minValue;
      this.maxValue = maxValue;
      this.colorSegmCount = colorSegmCount;
      this.gradientColorArr = [];
      this.gradientColorValueArr = [];

      this.calcGradientColorValue();
      this.calcGradientColor();
    },

    // 计算渐变色并存到数组gradientColorArr
    calcGradientColor: function() {
      // 两两颜色分段，计算相邻颜色之间需要计算的色段数
      var segment = this.colorSegmCount / this.colorPonitArr.length;
      for (var i = 0; i < this.colorPonitArr.length; i++) {
        if (i + 1 < this.colorPonitArr.length) {
          var jiangedian = 0;
          if (i == 0) jiangedian = segment + 2;
          else jiangedian = segment + 1;
          // console.log('segment:' + jiangedian);
          //获取分段
          var arr = [];
          arr = this.gradientColorObj.getGradientColorArr(
            this.rgbArrToHex(this.colorPonitArr[i]),
            this.rgbArrToHex(this.colorPonitArr[i + 1]),
            jiangedian
          );
          this.gradientColorArr = this.gradientColorArr.concat(arr);
        }
      }
    },

    // 计算渐变色对应的值，并存到数组 gradientColorValueArr
    calcGradientColorValue: function() {
      var step = (this.maxValue - this.minValue) / (this.colorSegmCount - 1);
      for (var i = 0; i < this.colorSegmCount; i++) {
        this.gradientColorValueArr.push((i * step + this.minValue).toFixed(4));
      }
    },

    // 创建色标段
    createSegmentedColor() {
      var segmentedColor = document.getElementById('segmentedColor');
      segmentedColor.innerHTML = '';

      var segmentedColorWidth = segmentedColor.offsetWidth;
      var segmentedColorHeight = segmentedColor.offsetHeight - 1;

      var width = (segmentedColorWidth / this.gradientColorArr.length - 0.1).toFixed(1);

      for (var i = 0; i < this.gradientColorArr.length; i++) {
        var rgb = 'rgb(' + this.gradientColorArr[i] + ')';
        var segment =
          "<div style='background-color:" +
          rgb +
          ';' +
          'width:' +
          width +
          'px;height:' +
          segmentedColorHeight +
          "px;float:left'></div>";

        segmentedColor.innerHTML += segment;
      }
    },
    createSegmentedColorValue() {
      var segmentedColorValue = document.getElementById('segmentedColorValue');
      segmentedColorValue.innerHTML = '';
      var segmentedColorValueWidth = segmentedColorValue.offsetWidth;
      var segmentedColorValueHeight = segmentedColorValue.offsetHeight;

      var len = this.gradientColorValueArr.length;
      var width = (segmentedColorValueWidth / len - 0.1).toFixed(1);

      var start = "<span style='float:left'>" + this.gradientColorValueArr[0] + '</span>';
      segmentedColorValue.innerHTML += start;
      var end = "<span style='float:right'>" + this.gradientColorValueArr[len - 1] + '</span>';
      if (this.gradientColorValueArr[0] != this.gradientColorValueArr[len - 1]) {
        segmentedColorValue.innerHTML += end;
      }
      // for (var i = 0; i < this.gradientColorValueArr.length; i++) {
      //   console.log(i);
      //   if (i % 4 == 0 || i == this.gradientColorValueArr.length - 1) {
      //     var wd = width;
      //     if (i == 0) {
      //       wd = 0;
      //     } else {
      //       wd = wd * 2.4; //宽度有问题需要修改
      //     }
      //     console.log('i：' + i + ' =' + this.gradientColorValueArr[i]);
      //     var segment =
      //       "<span style='margin-left: " + wd + "px;'>" + this.gradientColorValueArr[i] + '</span>';

      //     segmentedColorValue.innerHTML += segment;
      //   }
      // }
    },

    // 获取计算后的渐变色
    getGradientColorArr: function() {
      return this.gradientColorArr;
    },

    // 获取计算后的渐变色的值
    getGradientColorValueArr: function() {
      return this.gradientColorValueArr;
    },

    // 颜色数组转化为16进制
    rgbArrToHex: function(arr) {
      var hex = '#' + ((1 << 24) + (arr[0] << 16) + (arr[1] << 8) + arr[2]).toString(16).slice(1);
      return hex;
    }
  });
});
